import 'package:flutter/material.dart';
import 'package:flutter_swiper_view/flutter_swiper_view.dart';

class CustomScrollview extends StatefulWidget {
  const CustomScrollview({super.key});

  @override
  State<CustomScrollview> createState() => _CustomScrollviewState();
}

class _CustomScrollviewState extends State<CustomScrollview> {
  // 动态列表数据
  final List<int> _items = List.generate(10, (index) => index);
  final GlobalKey<AnimatedListState> _listKey = GlobalKey<AnimatedListState>();

  // 添加项目
  void _addItem() {
    final int newItem = (_items.isNotEmpty ? _items.last + 1 : 0); // 倒序逻辑：在末尾加新项
    _items.add(newItem); // 在列表尾部插入新项
    _listKey.currentState?.insertItem(_items.length-1); // 动画效果在索引 0
  }

  // 删除项目
  void _removeItem(int index) {
    final int removedItem = _items.removeAt(index);
    _listKey.currentState?.removeItem(
      index,
      (context, animation) => _buildItem(removedItem, animation),
    );
  }

  // 动画构建方法
  Widget _buildItem(int item, Animation<double> animation) {
    return SizeTransition(
      sizeFactor: animation,
      child: ListTile(
        title: Text('Item $item'),
        trailing: IconButton(
          icon: const Icon(Icons.delete),
          onPressed: () => _removeItem(_items.indexOf(item)),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: null, // 不使用普通 AppBar
      body:  CustomScrollView(
          slivers: [
            // 顶部轮播图部分
            const SliverAppBar(
              expandedHeight: 240, // 初始高度
              pinned: true, // 吸顶效果
              automaticallyImplyLeading: false, // 去除默认返回按钮
              flexibleSpace: FlexibleSpaceBar(
                collapseMode: CollapseMode.parallax, // 视差滚动效果
                background: SwiperHeader(), // 轮播图作为 Header
              ),
            ),

            // TabBar 独立部分，拥有独立背景
            SliverPersistentHeader(
              pinned: true,
              delegate: _SliverColorDelegate(Colors.blue, 50.0),
            ),

            // TabBarView 内容
            SliverFillRemaining(
              child: Column(
                children: [
                  ElevatedButton(
                    onPressed: _addItem,
                    child: const Text('Add Item'),
                  ),
                  Expanded(
                    child: AnimatedList(
                      key: _listKey,
                      initialItemCount: _items.length,
                      reverse: true, // 倒序渲染
                      itemBuilder: (context, index, animation) {
                        return _buildItem(_items[index], animation);
                      },
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      
    );
  }
}

// 轮播图组件
class SwiperHeader extends StatelessWidget {
  const SwiperHeader({super.key});

  @override
  Widget build(BuildContext context) {
    return Swiper(
      itemCount: 2, // 两张图片
      autoplay: true,
      itemBuilder: (context, index) {
        return Image.asset(
          index == 0
              ? 'lib/assets/images/common/home-banner-1.png'
              : 'lib/assets/images/common/home-banner-2.png',
          fit: BoxFit.cover,
        );
      },
    );
  }
}


// 自定义 SliverPersistentHeader 的颜色代理
class _SliverColorDelegate extends SliverPersistentHeaderDelegate {
  final Color color;
  final double height;

  _SliverColorDelegate(this.color, this.height);

  @override
  Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
    return Container(
      color: color, // 设置颜色
      alignment: Alignment.center,
      child: const Text(
        'This is a placeholder',
        style: TextStyle(color: Colors.white),
      ),
    );
  }

  @override
  double get maxExtent => height;

  @override
  double get minExtent => height;

  @override
  bool shouldRebuild(covariant _SliverColorDelegate oldDelegate) {
    return oldDelegate.color != color || oldDelegate.height != height;
  }
}

